<template>
  <div>
    <div class="then">123</div>
    <h3>全局组件注册: {{ about }}</h3>
    <div :class="isItalic ? 'thin':'notThin'">你好</div>
    <button @click="taggerStyle">切换</button>
  </div>
</template>

<script>
export default {
  name: "MyAbout",
  data() {
    return {
      isItalic: true      
    }
  },
  props: {
    about: {
      default: '李四'
    },
  },
  methods: {
    taggerStyle() {
      this.isItalic = !this.isItalic
      console.log(this.isItalic)
    }
  }
}
</script>

<style scoped>
  h3{
    color: green;
  };
  .thin{
    font-style: 20px;
    color: #333;
  };
  .notThin{
    font-size: 30px;
  }
</style>